<template>
  <j-modal title="分享资源" :width="1000" :visible="visible" :confirmLoading="confirmLoading" switchFullscreen @ok="handleOk"
    @cancel="handleCancel" cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model" :rules="validatorRules">
        <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="密码">
          <span style="display: inline-block;padding-right: 50px;">{{ this.password }}</span>
          <a-switch v-model="show" :style="{ backgroundColor: show ? 'lime' : '' }" />
          <span style="display: inline-block;margin-left: 50px;">
            有效期:&nbsp;&nbsp;
            <a-radio-group v-model="value" @change="onChange">
              1天
              <a-radio :value="1"> </a-radio>&nbsp;&nbsp;&nbsp;&nbsp;
              7天
              <a-radio :value="7"> </a-radio>&nbsp;&nbsp;&nbsp;&nbsp;
              长期
              <a-radio :value="0"> </a-radio>&nbsp;&nbsp;&nbsp;&nbsp;
              自定义
              <input min="1" type="number" @onfocus="Inputchange" @change="Inputchange"
                onkeyup="value=value.replace(/[^\d]/g,'').replace(/^0{1,}/g,'')" v-model="Nums" placeholder="数字(单位天)"
                class="Inputs" />
              <a-radio :value="8" style="margin-left: 10px;"> </a-radio>
            </a-radio-group>
          </span>
        </a-form-model-item>
        <a-form-model-item :labelCol="labelCol2" :wrapperCol="wrapperCol">
          <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;分享备注</span>
        </a-form-model-item>
        <a-form-model-item :labelCol="labelCol2" :wrapperCol="wrapperCol">
          <a-textarea style="margin-left: 38px;" v-model:value="notes" placeholder="请输入分享备注"
           maxlength="150" showCount="true"
            :auto-size="{ minRows: 2, maxRows: 5 }" />
        </a-form-model-item>

        <a-form-model-item :labelCol="labelCol2" :wrapperCol="wrapperCol">
          <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;分享资源详情</span>
        </a-form-model-item>
        <a-form-model-item>
          <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSources"
            style="margin-left: 38px;" :pagination="ipagination" @change="handleTableChange">
          </a-table>
        </a-form-model-item>
      </a-form-model>
    </a-spin>
  </j-modal>
</template>

<script>
import { httpAction, getAction, shareIndexurl } from '@/api/manage'
import moment from 'moment'
export default {
  name: 'BusTreviRiverPcModal',
  data() {
    return {
      title: '操作',
      visible: false,
      model: {},
      validTime: '',
      ipagination: '',
      show: true,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 2 }
      },
      labelCol2: {
        xs: { span: 24 },
        sm: { span: 3 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 20 }
      },
      value: 1,
      Nums: '',
      notes: '',
      datetime: '',//分享日期
      confirmLoading: false,
      validatorRules: {
        userId: [{ required: true, message: '请输入用户id!' }]
      },

      url: {
        list: `/shareInfo/shareInfo/queryShareInfoDetails`,
        add: '/shareInfo/shareInfo/add',
        edit: '/shareInfo/shareInfo/add',
        linkpassword: '/shareInfo/shareInfo/getLinkPassword'
      },
      validatorRules: {
        content: [{ required: true, message: '请输入评论' }]
      },
      columns: [
        {
          title: '资源名称',
          align: 'center',
          dataIndex: 'resourceName'
        },
        {
          title: '所属项目',
          align: 'center',
          dataIndex: 'projectName'
        },
        {
          title: '所属文件夹',
          align: 'center',
          dataIndex: 'folderName'
        },
        {
          title: '资源类型',
          align: 'center',
          dataIndex: 'fileSuffix'
        },
        {
          title: '分享链接',
          align: 'center',
          dataIndex: 'url'
        }
      ],
      password: '',
      dataSources: [],
      brr: [],
      ipagination: {
        current: 1,
        pageSize: 10,
        total: 0
      },

    }
  },
  mounted() {
    this.passwordlist()
  },
  methods: {
    //密码
    passwordlist() {
      let url = this.url.linkpassword
      getAction(url).then(res => {
        this.password = res.result
      })
    },
    handleTableChange(e, d) {
      this.ipagination.current = e.current
      this.datalist(this.brr)
    },
    //分享资源详情
    datalist(obj) {
      const httpurr = this.url.list
      const b = obj.join(',')
      const params = {
        shareIds: b,
        requestLink: shareIndexurl,
        pageNo: this.ipagination.current,
        pageSize: this.ipagination.pageSize
      }
      getAction(httpurr, params).then(res => {
        this.dataSources = res.result.records
        this.ipagination.total = res.result.total
      })
    },
    add() {
      //初始化默认值
      this.edit({})
      this.passwordlist()
    },
    edit(record) {
      this.model = Object.assign({}, record)
      console.log(record.id, 'record111111');
      //this.$parent.$parent.selectedRowKeys.add(recor
      if (record.id != undefined) {
        this.visible = true
        const arr = []
        arr.push(record.id)
        this.datalist(arr)
        return
      }

      if (!this.$parent.$parent.selectedRowKeys.length) {
        this.$message.warn('请选择资源列表需要分享的数据！')
        return

      }
      if (this.$parent.$parent.selectedRowKeys.length > 0) {
        this.visible = true
        const arr = this.$parent.$parent.selectedRowKeys
        this.brr = this.$parent.$parent.selectedRowKeys
        this.datalist(arr)
      }

    },
    close() {
      this.$emit('close')
      this.visible = false
      this.$refs.form.clearValidate()
      this.Nums = ''
      this.notes = ''
      this.value = 1
      this.$parent.$parent.selectedRowKeys = []
      this.dataSources = []
    },
    Inputchange(e) {
      this.value = 8
    },
    handleOk() {
      const that = this
      // 触发表单验证`
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true
          let arr = this.$parent.$parent.selectedRowKeys
          let b = arr
          let list = []
          this.dataSources.map(res => {
            list.push(res.id)
          })
          //fen
          console.log(moment(this.datetime).format('YYYY-MM-DD HH:mm:ss'), 'datetime');
          let param = {
            password: this.password,
            onOff: this.show == true ? 1 : 2,
            resourceIdList: b.join(',') || this.model.id,
            url: shareIndexurl,
            validTime: this.value == 8 ? this.Nums : this.value,
            type: '3',
            notes: this.notes,
          }
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'post'
          }
          httpAction(httpurl, param, method)
            .then(res => {
              if (res.success) {
                that.$message.success(res.message)
                this.Nums = ''
                this.notes = ''
                this.value = 1
                that.$emit('ok')
                this.$parent.$parent.selectedRowKeys = []
              } else {
                that.$message.warning(res.message)
              }
            })
            .finally(() => {
              that.confirmLoading = false
              that.close()
            })
        } else {
          return false
        }
      })
    },
    handleCancel() {
      this.close()
    },
    onChange(e) {
      console.log('radio checked', e.target.value)
    },

  }
}
</script>

<style lang="less" scoped>
/deep/ .ant-radio-inner {
  border-color: lime;
}

/deep/ .ant-form-item {
  margin-bottom: 0;
}

.Inputs {
  width: 101px;
  border-radius: 6px;
  border: 1px solid gray;
}
</style>
